import React, {Component} from 'react';
import {connect} from "react-redux";
import {Modal, Table, Tooltip} from 'antd';


class MonitorListList extends Component {
    constructor(props) {
        super(props);
        this.state = {
            data: [],
            pageNum: 1,
            pageSize: 10,
            current: 1
        }

        this.columns = [
            {
                title: '时间',
                dataIndex: 'createTime',
                align: 'center',

            },
            {
                title: '内容详情',
                dataIndex: 'contentDetailNum',
                align: 'center',

            },
            {
                title: '下单页面',
                dataIndex: 'orderPageNum',
                align: 'center',

            },
            {
                title: '导航详情',
                dataIndex: 'navDetailNum',
                align: 'center',

            },
            {
                title: '同城',
                dataIndex: 'cityNum',
                align: 'center',

            },
            {
                title: '主页',
                dataIndex: 'pageNum',
                align: 'center',

            },
            {
                title: '广场',
                dataIndex: 'squareNum',
                align: 'center',

            },
            {
                title: '消息',
                dataIndex: 'messageNum',
                align: 'center',

            },
            {
                title: '切换圈子',
                dataIndex: 'circleNum',
                align: 'center',

            },
            {
                title: '我的',
                dataIndex: 'myNum',
                align: 'center',

            },
            {
                title: '待处理',
                dataIndex: 'handleNum',
                align: 'center',

            },
            {
                title: '待处理详情',
                dataIndex: 'handleDetailNum',
                align: 'center',

            },
            {
                title: '进行中',
                dataIndex: 'runNum',
                align: 'center',

            },
            {
                title: '进行中详情',
                dataIndex: 'runDetailNum',
                align: 'center',

            },
            {
                title: '已完成',
                dataIndex: 'finishNum',
                align: 'center',

            },
            {
                title: '已完成详情',
                dataIndex: 'finishDetailNum',
                align: 'center',

            },
            {
                title: '余额',
                dataIndex: 'moneyNum',
                align: 'center',

            },
            {
                title: '推广盈利',
                dataIndex: 'extendNum',
                align: 'center',

            },
            {
                title: '发布技能',
                dataIndex: 'skillNum',
                align: 'center',

            },
            {
                title: '实名',
                dataIndex: 'realNameNum',
                align: 'center',

            }
        ];
    }

    componentDidMount() {
        this.init();
    }


    init = () => {
        const {list} = this.props
        list({page: 1, size: 10})
    }

    query = (current, pageSize) => {
        this.setState({current})
        this.props.list({ page: current, size: 10})
    }



    render() {
        const {data, userLoading} = this.props;
        const {visible, record, type, current} = this.state;
        const pagination = {
            current: data.current,//当前页
            total: data.total,//总条数
            pageSize: data.size,//页大小
            onChange: this.query,
            showQuickJumper: true,//快速跳转
            showSizeChanger: false//大于50时显示pageSize切换器
        };
        return (
            <div>
                <Table columns={this.columns}  dataSource={data.records}
                       rowKey={records => records.id} pagination={pagination}/>

            </div>

        );
    }
}


const mapState = state => ({
    ...state.apiMonitor
});

const mapDispatch = dispatch => ({
    ...dispatch.apiMonitor

})

export default connect(mapState, mapDispatch)(MonitorListList);